import React from 'react';
import { Tooltip } from 'antd';
import Dropdown from '@components/dropdown';
import DotsSvg from '../org-card/images/dots.svg';
import PropTypes from 'prop-types';
import _ from 'lodash';
import './index.less';
import access from '@util/access';

class TreeNodeTitle extends React.PureComponent {
  constructor(props) {
    super(props);
  }

  static propTypes = {
    nodeData: PropTypes.object,
    dispatchOperate: PropTypes.func,
    user: PropTypes.object
  };

  render() {
    const { nodeData, dispatchOperate, user } = this.props;
    const hasManage = access(user, 'asset-manage')(true);
    const name = _.get(nodeData, 'name', '');
    const staffCount = _.get(nodeData, 'staffCount', 0);
    let siteCount = _.get(nodeData, 'site_count', 0),
      hasChildren = _.get(nodeData, 'has_children', false),
      hasIpSegment = _.get(nodeData, 'hasIpSegment', false);

    let deleteMenuItem = null;
    if (siteCount || hasChildren || hasIpSegment) {
      deleteMenuItem = {
        title: (
          <Tooltip
            overlayClassName={'org-c-card-unable-delete-overlay'}
            title="无法删除！请确认该部门是否有所属资产或所属IP段或存在下属部门"
          >
            删除
          </Tooltip>
        ),
        disableConfirm: true,
        className: 'unable-delete'
      };
    } else {
      deleteMenuItem = {
        title: '删除',
        info: '是否要删除该部门?',
        closeDropdownBeforeConfirm: true,
        className: 'delete',
        onConfirm: () => dispatchOperate('delete', nodeData)
      };
    }
    const menus = [
      {
        title: '创建同级部门',
        closeDropdownBeforeConfirm: true,
        disableConfirm: true,
        onConfirm: () => dispatchOperate('createSib', nodeData)
      },
      {
        title: '创建下属部门',
        closeDropdownBeforeConfirm: true,
        disableConfirm: true,
        onConfirm: () => dispatchOperate('createChild', nodeData)
      },
      {
        title: '管理部门资产',
        closeDropdownBeforeConfirm: true,
        disableConfirm: true,
        onConfirm: () => dispatchOperate('manageSites', nodeData)
      },
      {
        title: '添加人员',
        closeDropdownBeforeConfirm: true,
        disableConfirm: true,
        onConfirm: () => dispatchOperate('addStaff', nodeData)
      },
      {
        title: '编辑',
        closeDropdownBeforeConfirm: true,
        disableConfirm: true,
        onConfirm: () => dispatchOperate('edit', nodeData)
      },
      deleteMenuItem
    ];
    if (!hasManage) {
      menus.splice(2, 1);
    }
    const more = {
      title: <img className="dots" src={DotsSvg} />,
      menus
    };
    return (
      <div className="tree-node-title">
        <div>
          {name}
          <div className="drop-down-wrapper">
            <Dropdown {...more} />
          </div>
        </div>
        <span>{staffCount}</span>
      </div>
    );
  }
}

export default TreeNodeTitle;
